<template>
   <div class="login">
      <div class="Left">
        <img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic.616pic.com%2Fbg_w1180%2F00%2F22%2F40%2Fvx3RdEWcPu.jpg&refer=http%3A%2F%2Fpic.616pic.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1661398825&t=e906e0e8e54f1fe595b6f7c6e4bcdc56" alt="">
        <div>
           
        </div>
      </div>
      <div class="Right">
        <el-tabs class="tab" v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="用户管理" name="first"></el-tab-pane>
            <el-tab-pane label="定时任务补偿" name="last"></el-tab-pane>
        </el-tabs>
      </div>
   </div>
</template>

<style scoped>
   .login{
    overflow: hidden;
    display: flex;
    width:800px;
    height:400px;
    border:1px solid #000;
    position: absolute;
    left:50%;
    top:50%;
    transform: translate(-50%,-50%);
    border-radius: 10px;
   }

   .login .Left {
      width:500px;   
    }

    .login .Left>img{
       width:100%;
       height:100%
    }

</style>

<script>
export default {
    name:"Login",
    data() {
      return {
        activeName: 'second'
      };
    },
    methods: {
      handleClick(tab, event) {
        console.log(tab, event);
      }
    }
}
</script>

